import { Component, OnInit, ViewChild } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { STColumn, STComponent, STData } from '@delon/abc/st';
import { SFComponent, SFDateWidgetSchema, SFSchema, SFUISchema } from '@delon/form';
import { ModalHelper, _HttpClient } from '@delon/theme';
import { AccountManagemantService } from '../../services/account-managemant.service';

@Component({
  selector: 'app-partner-account-management-account-detail',
  templateUrl: './account-detail.component.html',
  styleUrls: ['./account-detail.component.less']
})
export class PartnerAccountManagementAccountDetailComponent implements OnInit {
  headerTotalInfo: any = {
    allAmount: 0,
    incomeAmount: 0,
    payAmount: 0,
    name: '',
    ltdName: '',
    phone: ''
  };
  footerTotalInfo: any = {
    incomeAmount: 0,
    payAmount: 0,
    total: 0
  };


  url = `/user`;
  schema: SFSchema = {};
  ui!: SFUISchema;
  _$expand = false;
  @ViewChild('st') private readonly st!: STComponent;
  @ViewChild('sf') private readonly sf!: SFComponent;


  columns: STColumn[] = [];
  roleId = '';
  bankType = '';
  channelSource = '';
  ltdId = '';
  constructor(public service: AccountManagemantService, public ar: ActivatedRoute) {

    this.roleId = this.ar.snapshot.params.id;
    this.ar.queryParamMap.subscribe((res: any) => {
      this.ltdId = res?.params?.ltdId;
      this.channelSource = res?.params?.channelSource;
      this.bankType = res?.params?.bankType;
    })
  }


  get reqParams() {
    return { ...this.sf?.value, roleId: this.roleId, ltdId: this.ltdId, channelSource: this.channelSource, bankType: this.bankType };
  }
  ngOnInit(): void {
    this.getHeaderSummary();
    this.getFooterSummary();
    this.initSF();
    this.initST();
  }

  initSF() {
    this.schema = {
      properties: {
        _$expand: {
          type: 'boolean', ui: { hidden: true }
        },
        createTime: {
          type: 'string',
          title: '交易时间',
          ui: {
            widget: 'sl-from-to',
            type: 'date',
            autoComplete: 'off',
            format: 'yyyy-MM-dd',
          } as SFDateWidgetSchema,
        },
        transactionNumber: {
          title: '流水号',
          type: 'string',
          ui: {
            placeholder: '请输入',
          },
        },
        businessNumber: {
          title: '交易单号',
          type: 'string',
          ui: {
            placeholder: '请输入',
          },
        },
        tradeType: {
          type: 'string',
          title: '交易类型',
          default: '',
          ui: {
            widget: 'dict-select',
            params: {
              dictKey: 'trade:type'
            },
            placeholder: '请选择',
            allowClear: true,
            containsAllLabel: true,
            visibleIf: {
              _$expand: (value: boolean) => value,
            },
          },
        },
        incomeType: {
          type: 'string',
          title: '收支类型',
          default: '',
          ui: {
            widget: 'dict-select',
            params: {
              dictKey: 'income:type'
            },
            placeholder: '请选择',
            allowClear: true,
            containsAllLabel: true,
            visibleIf: {
              _$expand: (value: boolean) => value,
            },
          },
        },

      }
    }
    this.ui = { '*': { spanLabelFixed: 100, grid: { span: 8, gutter: 4 } }, };
  }

  /**
* 初始化数据列表
*/
  initST() {
    this.columns = [
      {
        title: '序号',
        className: 'text-center',
        width: '60px',
        format: (item: STData, col: STColumn, idx: number) => {
          return (this.st.pi * this.st.ps) - this.st.ps + idx + 1 + ''
        }
      },
      { title: '交易时间', index: 'createTime', className: 'text-center', width: 200 },
      { title: '流水号', index: 'transactionNumber', className: 'text-center', width: 180 },
      { title: '交易类型', index: 'tradeTypeLabel', className: 'text-center', width: 150 },
      { title: '交易单号', index: 'businessNumber', className: 'text-center', width: 180 },
      { title: '备注', index: 'tradeContent', className: 'text-center', width: 180 },
      { title: '收支类型', index: 'incomeTypeLabel', className: 'text-center', width: 180 },
      { title: '交易金额', render: 'amount', className: 'text-center', width: 150 },
      { title: '账户余额', render: 'accountBalance', className: 'text-center', width: 150 },
      { title: '付款方', index: 'payName', className: 'text-center', width: 200 },
      { title: '收款方', index: 'payeeName', className: 'text-center', width: 200 },
    ];
  }
  resetSF() {
    this._$expand = false;
    this.sf.reset();
    setTimeout(() => {
      this.st.reset();
    })
  }

  /**
* 伸缩查询条件
*/
  expandToggle() {
    this._$expand = !this._$expand;
    this.sf?.setValue('/_$expand', this._$expand);
  }
  /**
 * 头部汇总
 */
  getHeaderSummary() {
    const params = {
      roleId: this.roleId,
      ltdId: this.ltdId,
      channelSource: this.channelSource,
      bankType: this.bankType
    };
    this.service.request(this.service.$api_get_account_detail_header_summary, { ...params }).subscribe(res => {
      if (res) {
        this.headerTotalInfo = res;
        console.log(res);
      }
    })
  }
  /**
   * 脚部汇总
   */
  getFooterSummary() {
    this.service.request(this.service.$api_get_account_detail_footer_summary, this.reqParams).subscribe(res => {
      if (res) {
        this.footerTotalInfo = res;
      }
    })
  }


  search() {
    this.st.load(1);
  }
  export() { }

  goBack() {
    window.history.go(-1);
  }


}
